<template>
    <view
        class="bottom-bar cart-bottom-bar"
        :class="{ 'home-cart-bottom-bar': isHome, 'home-cart-bottom-bar-iphonex': isHome && isIphoneX }">
        <checkbox-group @change="checkboxChange" v-if="isShowSelect && productInfo.length > 0">
            <label class="item-radio custom-checkbox-box">
                <checkbox class="checkbox-mark" value="all" :checked="isSelectAllFn(selectData)"></checkbox>
                <custom-checkbox :isSelect="isSelectAllFn(selectData)"></custom-checkbox>
                <text class="text">全选</text>
            </label>
        </checkbox-group>

        <view class="item-mian" v-if="isEdit">
            <view class="price">
                <text @click="clearAll" class="text-color-3">清空购物车</text>
            </view>
            <text class="btn btn-success-hollow btn-del-color" @click="del">删除</text>
        </view>
        <view class="item-mian" v-else>
            <view class="price">
                <view class="price-box">
                    <text class="price-text price-text-main">{{ totalPrice }}</text
                    ><text class="price-text small">元</text>
                </view>
                <view class="num"
                    ><text>{{ totalSpace }}种</text><text>{{ parseFloat(Number(totalSum).toFixed(6)) }}件</text></view
                >
            </view>
            <button
                class="btn btn-success btn-submitOrder"
                @click="goSubmitOrder"
                :disabled="productInfo.length < 1 || selectData.ids.length < 1"
                :class="{ disable: productInfo.length < 1 || selectData.ids.length < 1 }">
                去结算
            </button>
        </view>
        <uni-popup ref="tip" type="dialog">
            <uni-popup-dialog
                type="text"
                title="温馨提示"
                content="确定清空购物车？"
                :before-close="true"
                @close="close"
                @confirm="confirm"></uni-popup-dialog>
        </uni-popup>
    </view>
</template>

<script>
import customCheckbox from "@/components/common/custom-checkbox.vue"
import { getCartTotalForSelect } from "@/utils/cartUtil.js"
import storage from "@/uni-sub-base/utils/storage.js"

export default {
    components: {
        customCheckbox,
    },
    props: {
        selectData: {
            type: Object,
            default: {},
        },
        getUseAddress: {
            type: Object,
            default: () => {},
        },
        TakeDelivery: {
            type: Object,
            default: () => {},
        },
        productInfo: {
            type: Array,
            default: () => [],
        },
        isShowSelect: {
            type: Boolean,
            default: true,
        },
        isEdit: {
            type: Boolean,
            default: false,
        },
        isDirect: {
            type: Boolean,
            default: false,
        },
        isHome: {
            type: Boolean,
            default: false,
        },
        orderType: {
            type: Number,
            default: 0,
        },
    },
    data() {
        return {
            totalPrice: 0,
            totalNum: 0,
            totalSum: 0,
            totalSpace: 0,
            isIphoneX: false,
            webInfo: null,
        }
    },
    watch: {
        selectData() {
            this.getTotal(this.productInfo)
        },
    },
    created() {
        const res = uni.getSystemInfoSync()
        const { model, statusBarHeight } = res
        if (
            (model.indexOf("iPhone") > -1 && statusBarHeight > 20) ||
            model.indexOf("iPhone X") > -1 ||
            model.indexOf("iPhone 1") > -1
        ) {
            this.isIphoneX = true
        }
    },
    mounted() {
        this.webInfo = storage.getCache("webInfo")
        this.getTotal(this.productInfo)
    },
    methods: {
        //获取总数
        getTotal(data) {
            getCartTotalForSelect(data, this.selectData.ids, (res) => {
                this.totalPrice = res.totalPrice
                this.totalNum = res.totalNum
                this.totalSpace = res.totalSpace
                this.totalSum = res.totalSum
            })
        },
        //确认清空购物车
        confirm() {
            this.close()
            this.$emit("delCart", true)
        },
        //关闭提示
        close() {
            this.$refs.tip.close()
        },
        //清空购物车
        clearAll() {
            if (this.productInfo.length > 0) {
                this.$refs.tip.open()
            }
        },
        //删除物品
        del() {
            this.$emit("delCart", false)
        },
        //去结算
        goSubmitOrder() {
            // 最多只能选择一个仓库下单
            const isInclude = (arr1, arr2) => arr2.some((val) => arr1.includes(val))
            const allIds = this.productInfo.map((item) => item.SubItems.map((v) => v.ID))
            let num = 0
            allIds.forEach((item) => {
                if (
                    isInclude(
                        this.selectData.ids,
                        item.map((v) => String(v)),
                    )
                ) {
                    num++
                }
            })
            if (num > 1) {
                this.easyToast("请将不同仓库商品分开下单")
                return
            }
            let ids = this.selectData.ids
            if (ids.length > 0) {
                if (this.orderType > 0) {
                    if (this.getUseAddress && this.getUseAddress.ContactName) {
                        if (this.TakeDelivery.ID) {
                            this.easyGoTo(
                                "/pages_shop/packet/order/submitOrder?ids=" +
                                    ids.join(",") +
                                    "&orderType=" +
                                    this.orderType,
                            )
                        } else {
                            this.easyToast("请先添加自提点")
                            return
                        }
                    } else {
                        this.easyToast("请先添加收货人信息")
                        return
                    }
                } else {
                    const id = ids[0]
                    let wareHouseId
                    this.productInfo.forEach((item) => {
                        item.SubItems.forEach((v) => {
                            if (v.ID == id) {
                                wareHouseId = v.WarehouseId
                            }
                        })
                    })
                    if (this.isDirect) {
                        this.easyGoTo(
                            "/pages_shop/packet/order/submitOrder?ids=" +
                                ids.join(",") +
                                "&from=cart" +
                                "&orderType=24&wareHouseId=" +
                                wareHouseId,
                        )
                    } else {
                        if (this.webInfo.IsSelectWarehouse == 1) {
                            this.easyGoTo(
                                "/pages_shop/packet/order/submitOrder?ids=" +
                                    ids.join(",") +
                                    "&from=cart" +
                                    "&wareHouseId=" +
                                    wareHouseId,
                            )
                        } else {
                            this.easyGoTo("/pages_shop/packet/order/submitOrder?ids=" + ids.join(",") + "&from=cart")
                        }
                    }
                }
            }
        },
        //全选操作
        checkboxChange(e) {
            let values = e.detail.value
            let isAll = values.length > 0 && values[0] == "all"
            this.$emit("selectAll", isAll)
        },
        //全选是否选中
        isSelectAllFn(data) {
            let ids = data.ids
            let allPro = 0
            this.productInfo.forEach((pro) => {
                pro.SubItems.forEach((sub) => {
                    allPro += 1
                })
            })
            let isSelectAll = ids.length > 0 && ids.length == allPro
            this.$emit("isSelectAllBack", isSelectAll)
            return isSelectAll
        },
    },
}
</script>

<style lang="scss">
.home-cart-bottom-bar {
    bottom: 54px;
}
.home-cart-bottom-bar-iphonex {
    // bottom: 74px;
}
.cart-bottom-bar {
    flex-direction: row;
    z-index: 9;

    .item-mian {
        display: flex;
        flex-direction: row;
        align-items: center;
        flex: 1;
    }

    .price {
        display: flex;
        flex: 1;
        flex-direction: column;
        align-items: flex-end;
        justify-content: center;
        margin-right: 20rpx;
        .price-box {
            display: flex;
            flex-direction: row;
            align-items: flex-end;
        }
        .price-text {
            font-size: $font-size-36;
            font-weight: 400;
            color: $color-red;
        }
        .price-text-main {
            font-weight: bold;
            color: $app-color-main;
        }
        .num {
            text {
                // margin-left: 10rpx;
            }
        }
        .small {
            font-size: $font-size-26;
            margin-left: 6rpx;
            margin-bottom: 6rpx;
            color: #333333;
        }
        .text-color-3 {
            font-size: 24rpx;
            color: $color-gray-3;
        }
    }
}
.btn-del-color {
    border-color: $color-gray-1;
    color: $color-gray-1;
    font-size: 28rpx;
}
.item-radio {
    display: flex;
    flex-direction: row;
    align-items: center;

    .text {
        margin-left: 10rpx;
    }
}
.btn-submitOrder {
    width: 220rpx;
    height: 80rpx;
    border-radius: 45rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 32rpx;
    color: #ffffff;
}
</style>
